<template>
    <!--只读审批12步-->
    <div style="position: relative;width: 100%">
        <Steps :current="currentTab" id="TitleReadOnly">
            <Step title="家庭信息" content="" @click.native="clickStep(0)"></Step>
            <Step title="家庭成员" content="" @click.native="clickStep(1)"></Step>
            <Step title="基础收入" content="" @click.native="clickStep(2)"></Step>
            <Step title="家庭附件" content="" @click.native="clickStep(3)"></Step>
            <Step title="临时救助申请" content="" @click.native="clickStep(4)"></Step>
        </Steps>
        <div id="ContentReadOnly">
            <step1 v-if="currentTab == 0"/>
            <step2 v-if="currentTab === 1"/>
            <step3 v-if="currentTab === 2"/>
            <step4 v-if="currentTab === 3"/>
            <step5 v-if="currentTab === 4"/>
        </div>
    </div>
</template>

<script>
    import step1 from '../ls11_view_steps/application1'
    import step2 from '../ls11_view_steps/application2'
    import step3 from '../ls11_view_steps/application3'
    import step4 from '../ls11_view_steps/application10'
    import step5 from '../ls11_view_steps/application12'
    import '@/views/common/css/common.css';

    export default {
        name: "index",
        components: {
            step1,
            step2,
            step3,
            step4,
            step5,
        },
        data() {
            return {
                currentTab: 999,
                familyInfo: {}
            }
        },
        methods: {
            edit(record) {
                this.familyInfo = Object.assign({}, record);
                this.currentTab = 0;
            },
            clickStep(currentTab) {
                this.currentTab = currentTab
            },
        },

    }
</script>

<style scoped>
    #ContentReadOnly {
        position: relative;
        width: 100%;
        /*overflow: auto;*/
        margin-top: 10px;
        min-height: 400px;
    }

    #TitleReadOnly {
        position: relative;
        width: 100%;
        height: 50px;
        border-bottom: 1px solid #ddd;
    }

    /deep/ .ivu-steps-item {
        cursor: pointer;
    }

</style>
